<style>
.icontd {
  padding-left: 20px;
  width: 75px;
  height: 64px;
}
.table1 {
  border: thick solid #cccccc;
  width: 100%;
}
.table1 tr {
  cursor: pointer;
}
.table1 td {
  padding-left: 10px;
}
.table1 tr.even {
  background-color: #eeeeee;
}
.table1 tr.odd {
  background-color: #ffffff;
}
</style>
<div id="{{$t|escape:'html'}}_container" style="width: 100%;">
  <table class="table1" width="100%">
    <tr style="height: 30px;">
      <td width="25px"></td>
      <td width="50px" style="padding-left: 10px"><b>No.</b></td>
      <td width="300px" style="padding-left: 10px"><b>Name</b></td>
      <td width="300px" style="padding-left: 10px"><b>Code</b></td>
      <td style="padding-left: 10px"><b>Action</b></td>
    </tr>
    {{foreach $instances as $obj}}
    <tr class="{{if ($obj@iteration + 1) is div by 2}}even{{else}}odd{{/if}}">
      <td style="height: 30px;"></td>
      <td>{{$obj@iteration}}</td>
      <td>{{$obj->name}}</td>
      <td>&#123;{{$obj->folder}}: {{$obj->id}}&#125;</td>
      <td onclick="setInstance('{{$obj->id}}', '{{$obj->folder}}');"></td>
    </tr>
    {{/foreach}}
      {{if empty($instances)}}
        <tr>
          <td colSpan="5" style="padding: 30px 0 30px 40px;">NO PLUGINS FOUND</td>
        </tr>
      {{/if}}
  </table>
</div>

<script type="text/javascript" src="libs/pz/effect/myeffect.js"></script>
<script type="text/javascript">
  <!--
    function setInstance(instance_id, plugin_forder) {
      var container = document.getElementById('{{$t|escape:'html'}}_container');
      MyEffect.slide(container, null, function() { location.href = 'plugin.php?i=' + instance_id + '&f=' + plugin_forder + '&s=admin'; });
    }
  // -->
</script>